import React, { Component } from "react";
import ActionSheet from 'react-native-actionsheet'
import {
	Dimensions,
	Platform
} from 'react-native'
import { StyleSheet } from 'react-native';
export const hairlineWidth = StyleSheet.hairlineWidth

const ScreenWidth = Dimensions.get('window').width;
const scale = ScreenWidth / 375;

export class HxActionSheet extends Component {
	constructor(props) {
		super(props);
		let Platformios = Platform.OS;
		let { styles, options, optionsIOS, title, titleIOS, tintColor, cancelButtonIndex, destructiveButtonIndex, onPress } = this.props;
		this.state = {
			title: Platformios ? titleIOS : title,  //标题设置
			options: Platformios ? optionsIOS : options,  //栏目数组 （包括标题和底部取消）
			cancelButtonIndex: cancelButtonIndex || 0,   // 取消按钮在数组里的位置
			destructiveButtonIndex: destructiveButtonIndex || 1,
			onPress: (i) => { onPress(i) },   // 点击每个栏目  有索引值
			styles   // 自定义样式
		}
	}
	onShowCustomActionSheet () {
		this.ActionSheet.show();
	}
	render () {
		let { styles, tintColor, options, title, cancelButtonIndex, destructiveButtonIndex, onPress } = this.state;


		return (
			<ActionSheet
				ref={o => this.ActionSheet = o}
				tintColor={tintColor}
				title={title}
				options={options}
				cancelButtonIndex={cancelButtonIndex}
				destructiveButtonIndex={destructiveButtonIndex}
				onPress={onPress}
				styles={styles}
			/>
		)
	}
}
const styles = {
	overlay: {
		position: 'absolute',
		top: 0,
		right: 0,
		bottom: 0,
		left: 0,
		opacity: 0.4,
		backgroundColor: '#000',
		paddingLeft: 15 * scale,
		paddingRight: 15 * scale
	},
}
